<template>
  <h2>ChartControlTree 实控人树形图</h2>
  <p>本组件不依赖 echarts。</p>
  <h3>ChartControlTree 属性</h3>
  <table-info type="props" :data="propsTable"></table-info>
  <h3>案例</h3>
  <code-demo :code="code">
    <chart-control-tree :data="data"></chart-control-tree>
  </code-demo>
</template>

<script setup>
const data = [
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
]

const propsTable = [
  {
    name: 'data',
    desc: '数据列表，第一项的 value 为公司名，第二项为控制百分比，第三项为公司名，以此循环，最后一项应为公司名。',
    type: 'Array<{ value: string }>',
  },
]

const code = `<chart-control-tree :data="data"></chart-control-tree>

const data = [
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
  { value: '100%' },
  { value: 'xxxx有限公司' },
]`
</script>
